<template>
  <div class="main">
    <el-card  shadow="hover">
      <template #header>
        <div class="card-header" style="height: 200px">
          <div>
            <img
              :src="user.avatar"
              style="
                width: 200px;
                height: auto;
                margin-left: 10px;
                border-radius: 50%;
              "
              alt=""
            />
          </div>
          <div style="margin-left: 260px; margin-top: -120px">
            <span><b style="color: gray">权限：</b>超级管理员</span>
            <br />
            <br />
            <span
              ><b style="color: gray; margin-top: ">昵称：</b
              >{{ user.username }}</span
            >
          </div>
        </div>
      </template>
      <div>
        <span style="color: gray; font-size: 15px; margin-left: 20px"
          >上次登录时间:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <b>{{ dateFormat(time.loginTime) }}</b></span
        >
      </div>
    </el-card>
  </div>
  <div>
    <div>
      <el-card class="box-card" style="width:200px; margin-top:-300px; float:left;margin-left:520px;">
        <div>
          <el-image></el-image>
        </div>
        <div>
          <span>平台成员</span>
        </div>
      </el-card>
    </div>
    <div>
      <el-card class="box-card"  style="width:200px; margin-top:-300px; float:left;margin-left:740px">
        <div>
          <el-image></el-image>
        </div>
        <div>
          <span>今日新增</span>
        </div>
      </el-card>
    </div>
  </div>
</template>

<script>
import { getLoginTime, setLoginTime } from "../../api";

export default {
  data() {
    return {
      user: JSON.parse(localStorage.getItem("user") || "{}"),
      tableData: [],
      time: {
        id: "",
        loginTime: "",
      },
      logTime: {
        id: "",
        loginTime: "",
      },
    };
  },
  methods: {
    fetchData() {
      console.log(JSON.parse(localStorage.getItem("user")));
      getLoginTime(JSON.parse(localStorage.getItem("user"))).then((res) => {
        console.log(res);
        this.time.loginTime = res.data.loginTime;
        this.time.id = res.data.id;
        this.logTime.id = res.data.id;
        this.logTime.loginTime = new Date();
        console.log(this.logTime.loginTime);
        setLoginTime(this.logTime).then((res) => {
          console.log(res);
        });
      });
    },
    dateFormat(data) {
      let date = new Date(data);
      let YY = date.getFullYear() + "-";
      let MM =
        (date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1) + "-";
      let DD = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      let h = date.getHours();
      h = h < 10 ? "0" + h : h;
      let m = date.getMinutes();
      m = m < 10 ? "0" + m : m;
      12;
      let s = date.getSeconds();
      s = s < 10 ? "0" + s : s;
      console.log(h);
      return YY + MM + DD + " " + h + ":" + m + ":" + s;
    },
  },
  created() {
    this.fetchData();
  },
};
</script>

<style scoped>
.main {
  width: 500px;
}

</style>